<template>
	<view>
		<u-checkbox v-model="itemInfo.checked" :label-disabled="false">
			<view style="font-size:30rpx" class="p-8">
				<text class="sub-title">案件编号：</text>
				<text>{{ itemInfo.caseCode }}</text>
			</view>

			<view style="font-size:30rpx" class="p-8">
				<text class="sub-title">文书名称：</text>
				<text>{{ itemInfo.docName }}</text>
			</view>
			<view style="font-size:30rpx" class="p-8">
				<text class="sub-title">物品名称：</text>
				<text>{{ itemInfo.goodsName }}</text>
			</view>
			<view style="font-size:30rpx" class="p-8">
				<text class="sub-title">库位名称：</text>
				<text>{{itemInfo.propTypeName}}</text>
			</view>
			<view class="prop-type-content p-8">
				<view>
					<text class="sub-title">物品大类：</text>
					<text>{{itemInfo.propTypeName}}</text>
				</view>
				<view>
					<text class="sub-title">物品小类：</text>
					<text>{{itemInfo.propSubTypeName}}</text>
				</view>
			</view>
		</u-checkbox>

		<u-row gutter="16" class="p-8 pb-8">
			<u-col span="2">
				<view class="part-item-info">
					<view class="sub-title jc">
						总条数
					</view>
					<view class="main-info">
						{{itemInfo.baseQty || 0}}
					</view>
				</view>
			</u-col>
			<u-col span="3">
				<view class="part-item-info">
					<view class="sub-title jc">
						已封箱条数
					</view>
					<view class="main-info">
						{{itemInfo.sealQty}}
					</view>
				</view>
			</u-col>
			<u-col span="4">
				<view class="part-item-info">
					<view class="sub-title jc">
						实际封箱条数
					</view>
					<view class="main-info ">
						<u-number-box :min="0" :positive-integer="false" :step="1" :max="itemInfo.maxSurplusQty || 0"  v-model="itemInfo.surplusQty"></u-number-box>
					</view>
				</view>
			</u-col>
			<u-col span="3">
				<view class="part-item-info">
					<view class="sub-title jc">
						库位
					</view>
					<view class="main-info main-info-color">
						<u-image src="../../../static/store/store-home.png" width="41" height="45" />{{itemInfo.psCode || "/" }}
					</view>
				</view>
			</u-col>
		</u-row>
	</view>
</template>

<script>
	export default {
		props: {
			itemInfo: {
				type: Object,
				default: () => {
					return {

					}
				},
			},
		},
		data() {
			return {};
		},

		methods: {

		},
	};
</script>

<style lang="scss" scoped>
	.form-style {
		padding: 0rpx 30rpx
	}


	.fs-title {
		font-weight: bold;
		font-size: 32rpx;
	}

	.part-item-info {
		text-align: left;

		.main-info-color {
			color: $u-content-color;
			font-weight: 600;
			margin-bottom: 5px;
			color: #0070D2;
		}
	}

	.sub-title {
		color: $u-tips-color;
		padding-bottom: 10rpx;
		font-size: 26rpx;
	}

	.jc {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.main-info {
		color: $u-content-color;
		font-weight: 600;
		margin-bottom: 5px;
		display: flex;
		align-items: center;
		justify-content: center
	}

	.total-sty {
		padding-top: 20rpx;
	}

	.p-8 {
		padding-top: 16rpx;
	}

	.pb-8 {
		padding-bottom: 16rpx;
	}

	.fs-content {
		display: flex;
		justify-content: space-around;
		flex-direction: row;
		align-content: center;
		align-items: stretch;
		text-align: center;
		flex-wrap: nowrap;
	}

	.form-style-title {
		display: flex;
		justify-content: space-between;
		flex-direction: row;
		width: 100%;
		align-items: flex-start;
		color: $u-main-color
	}

	.prop-type-content {
		display: flex;
		justify-content: space-between;
		flex-direction: row;
		flex-wrap: nowrap;
		align-content: space-around;
		align-items: stretch;
	}

	/deep/ .u-checkbox-group {
		display: contents;
	}

	/deep/ .u-checkbox {
		flex-wrap: nowrap;
		align-content: flex-start;
		display: flex;
		align-items: center;
		flex-direction: row-reverse;
		justify-content: space-between;
		width: 96% !important;
	}

	/deep/ .u-checkbox__label {
		margin-right: 0 !important;
		width: 100%;
	}
</style>